<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	template="../templates/ui.xhtml">

	<ui:define name="content">
		<h1 class="title ui-widget-header ui-corner-all">Layout - Element</h1>
		<div class="entry">
           	<p>Layouts can also be created at element level. Example below is a simple split panel implementation.</p>    	
           	
       		<p:layout style="min-width:400px;min-height:200px;" id="layout">
       			<p:layoutUnit position="west" resizable="true" size="100" minSize="40" maxSize="200">
       				Left
       			</p:layoutUnit>
       			
       			<p:layoutUnit position="center">
       				Center
       			</p:layoutUnit>
       		</p:layout>
				
			<h3>Source</h3>
            <p:tabView>
                <p:tab title="layoutElement.xhtml">
                    <pre name="code" class="xml">
&lt;p:layout style="min-width:400px;min-height:200px;" id="layout"&gt;
    &lt;p:layoutUnit position="west" resizable="true" size="100" minSize="40" maxSize="200"&gt;
        Left
    &lt;/p:layoutUnit&gt;

    &lt;p:layoutUnit position="center"&gt;
        Center
    &lt;/p:layoutUnit&gt;
&lt;/p:layout&gt;
                    </pre>
                </p:tab>
            </p:tabView>

      </div>
 
</ui:define>
</ui:composition>
				